<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <link rel="icon" href="/favicon.ico" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>博客</title>
  <script>
    (function () {
      function autoRootFontSize() {
        //设置根节点最小缩放字节大小为10px。并以1920屏幕宽度开发，10px对应1rem,保证了大于1920屏幕宽度的看起来和1920的一样
        var w = document.documentElement.clientWidth || document.body.clientWidth;
        var d = document.getElementsByTagName('html')[0];
        d.style.fontSize = Math.max((w / 192.0), 10) + 'px';
      }
      //对于组件不能实现px转rem，可以通过正则把组件样式的px转成rem let str="组件的css字符串"; str.replace(/\d+px/ig,function(str){return (parseInt(str,10)/10).toFixed(6) + 'rem'})
      //也可以直接把element-plus的css代码替换给element-plus/lib/theme-chalk/index.css
      window.addEventListener('resize', autoRootFontSize);
      autoRootFontSize();
    })();
  </script>
</head>

<body>
  <div id="app"></div>
  <script type="module" src="/src/main.ts"></script>
</body>

</html>